<template>
    <div class="tabs border-1px">
        <div class="tab-item"><router-link to="/" class="link">商品</router-link></div>
        <div class="tab-item"><router-link to="/links" class="link">评论</router-link></div>
        <div class="tab-item"><router-link to="/good" class="link">商家</router-link></div>
    </div>
</template>

<script>
export default {
  name: "navs"
};
</script>

<style lang="stylus">
@import "../assets/css/mixin.styl"
.tabs
    display flex
    width 100%
    height 40px
    line-height 40px
    //border-bottom 0.5px solid rgba(7,17,27,0.1)
    border-1px(rgba(7,17,27,0.1))
    .tab-item
        flex 1
        text-align center
        & > .link
           display block
           text-decoration none
           font-size 14px
           color rgb(77 85 93)
           &.active
             color #f01414
</style>
